<!-- eslint-disable vue/multi-word-component-names -->
<template>
    <div>
        缓存组件
        <h4>
            知识点: keepalive
            用来缓存组件,可以用它包裹router-view标签.通过这个视口展示的组件,就能够被缓存.
            它自身有一些属性.include(要缓存的组件) exclude(不缓存的组件)
            max(最多缓存个数) vue2:
            走了keepalive包裹的组件.第一进来走所有的生命周期.离开的时候走
            deactived(失去激活) 下次进来只走actived(激活状态) vue3:
            原理:在这个keepalive实现上,是在里面创先了一个缓存的对象.
            vue把一个个组件抽象成了一个vNode组件实例,
            在进行组件加载的时候,判断如果对象里面有,就直接拿出来使用.如果没有,但是名字.如果在include里面的.或者不在exclude里面的,就是需要被缓存的.
            就要存到这个对象里面.维护这个对象.当缓存的个数超过了max之后.就会把最早的删除掉.最新需要被缓存的push进来
        </h4>
    </div>
</template>
<script setup lang="ts"></script>
<style scoped lang="scss"></style>